<template>
  <a-card :bordered="false">
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchList">
        <a-row :gutter="24">
          <a-col :md="6" :sm="12">
            <a-form-item label="推荐人">
              <a-input placeholder="请输入关键字" v-model="queryParam.refereesSearch"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="12">
            <a-form-item label="被推荐人">
              <a-input placeholder="请输入关键字" v-model="queryParam.referralSearch"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="12">
            <a-form-item label="推荐时间">
              <a-range-picker style="width: 100%" showToday valueFormat="YYYY-MM-DD" format="YYYY-MM-DD" v-model="queryParam.regTime" />
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="6">
            <span :style="{ float: 'right', overflow: 'hidden', marginright: '20px' }">
              <a-button type="primary" @click="searchList">查询</a-button>
              <a-button style="margin-left: 12px; margin-right: 24px" @click="resetList">重置</a-button>
              <a-button type="primary" @click="exportClick">下载</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
      <a-tabs v-model="queryParam.ruleType" @change="callback">
        <a-tab-pane key="1" tab="取最高条件奖励"> </a-tab-pane>
        <a-tab-pane key="2" tab="满足条件即奖励"> </a-tab-pane>
        <a-tab-pane key="3" tab="单条件循环奖励"> </a-tab-pane>
      </a-tabs>
      <s-table ref="table" size="default" :rowKey="record => record.id" :columns="columns" :data="loadData" :pagination="paginationProps"> </s-table>
    </div>
  </a-card>
</template>
<script>
const columns = [
  {
    title: '编号',
    dataIndex: 'id',
    align: 'center'
  },
  {
    title: '推荐人昵称',
    dataIndex: 'refereesName',
    align: 'center'
  },
  {
    title: '推荐人会员卡号',
    dataIndex: 'refereesCard',
    align: 'center'
  },
  {
    title: '推荐人手机号',
    dataIndex: 'refereesTel',
    align: 'center'
  },
  {
    title: '推荐时间',
    dataIndex: 'time',
    align: 'center'
  },
  {
    title: '推荐人所获奖励',
    dataIndex: 'refereesReward',
    align: 'center'
  },
  {
    title: '奖励原因',
    dataIndex: 'rewardWhy',
    align: 'center'
  },
  {
    title: '被推荐人昵称',
    dataIndex: 'referralName',
    align: 'center'
  },
  {
    title: '被推荐人会员卡号',
    dataIndex: 'referralCard',
    align: 'center'
  },
  {
    title: '被推荐人手机号',
    dataIndex: 'referralTel',
    align: 'center'
  },
  {
    title: '被推荐人所获奖励',
    dataIndex: 'referralTReward',
    align: 'center'
  }
]
import JInput from '@/components/jeecg/JInput'
import { getEventDetail, contentExport } from '@/api/marketingCenter/passenger.js'
import { STable, Ellipsis } from '@views/box/components'
export default {
  components: {
    JInput,
    STable,
    Ellipsis
  },
  data() {
    return {
      columns,
      queryParam: {
        id: this.$route.params.id,
        refereesSearch: null, //推荐人
        referralSearch: null, // 被推荐人
        ruleType: '1',
        regTime: [] // 时间
      },
      paginationProps: {
        current: 1,
        pageSize: 10,
        total: 0,
        showTotal: total => `共有 ${total} 条数据`
      },
      // 加载数据方法 必须为 Promise 对象
      loadData: parameter => {
        const queryParam = JSON.parse(JSON.stringify(this.queryParam))
        const data = {
          ...queryParam,
          current: parameter.pageNo,
          size: parameter.pageSize
        }
        if (queryParam.regTime && queryParam.regTime.length > 0) {
          data.startTime = queryParam.regTime[0]
          data.endTime = queryParam.regTime[1]
        } else {
          data.startTime = null
          data.endTime = null
        }
        delete data.regTime

        return getEventDetail(data).then(res => {
          if (res.code === 200) {
            const { records, total, size, current } = res.data
            const data = {
              page: {
                count: total,
                pageNo: current,
                pageSize: size,
                pages: Math.ceil(total / size)
              },
              data: records
            }

            return data
          } else {
            this.$message.error(res.msg || res.message)
            const data = {
              page: {
                pageNo: 0,
                count: 0,
                pageSize: 10
              },
              data: []
            }
            return data
          }
        })
      }
    }
  },
  methods: {
    callback(key) {
      this.queryParam.ruleType = key
      this.$refs.table.refresh()
    },
    searchList() {
      this.$refs.table.refresh(true)
    },
    exportClick() {
      let data = {}

      if (this.queryParam.regTime && this.queryParam.regTime.length > 0) {
        data.startTime = this.queryParam.regTime[0]
        data.endTime = this.queryParam.regTime[1]
      } else {
        data.startTime = null
        data.endTime = null
      }
      window.location.href =
        contentExport +
        `?id=${this.queryParam.id}&ruleType=${this.queryParam.ruleType}&startTime=${data.startTime}&endTime=${data.endTime}&refereesSearch=${this.queryParam.refereesSearch}&referralSearch=${this.queryParam.referralSearch}`
    },
    // 重制
    resetList() {
      this.queryParam.regTime = null
      this.queryParam.refereesSearch = null //推荐人
      this.queryParam.referralSearch = null // 被推荐人
      this.queryParam.ruleType = '1'
      this.$refs.table.refresh(true)
    }
  }
}
</script>
<style  scoped lang="less">
</style>